<template>
	<view>
		<!-- <button class="btns" type="primary" @tap="openAddres">默认打开地址</button> -->
		<view class="city" @tap="openAddres">
			当前查看的城市：{{address}}
		</view>
		<scroll-view class="scroll">
			<block v-for="(item,index) in list" :key="index" class="block1">
				<view class="box">
					<view class="box1">
						<text>养殖场名称：{{item.name}}</text>
						<text>建立时间：{{item.createTime}}</text>
					</view>
					<view class="box2">
						<text>猪仔数量：{{item.count}}</text>
						<text>最近消毒时间：{{item.xiaoduTime}}</text>
					</view>
				</view>
			</block>
		</scroll-view>
		<simple-address ref="simpleAddress" :pickerValueDefault="cityPickerValueDefault" @onConfirm="onConfirm" themeColor="#007AFF"></simple-address>
	</view>
</template>

<script>
import simpleAddress from '@/components/simple-address/simple-address.vue';
export default {
	data () {
		return {
			address: '',
			cityPickerValueDefault: [0, 0, 1],
			list: [
				{
					createTime: '2018-03-03',
					name: '猪场',
					xiaoduTime: '2018-03-03',
					count: '23423'
				},
				{
					createTime: '2018-03-03',
					name: '养猪场',
					xiaoduTime: '2018-03-03',
					count: '23423'
				},
				{
					createTime: '2018-03-03',
					name: '汤猪场',
					xiaoduTime: '2018-03-03',
					count: '23423'
				},
				{
					createTime: '2018-03-03',
					name: '宰猪场',
					xiaoduTime: '2018-03-03',
					count: '23423'
				},
				{
					createTime: '2018-03-03',
					name: '宰猪',
					xiaoduTime: '2018-03-03',
					count: '23423'
				}
			]
		}
	},
	onLoad() {
		this.getLocation()
	},
	components: {
		simpleAddress
	},
	methods: {
		getLocation () {
			uni.getLocation({
				geocode: true,
			    type: 'wgs84',
			    success: res=> {
					this.address = res.address.province + '-' + res.address.city + '-' + res.address.district
					console.log(this.address)
			     }   
			});
		},
		openAddres() {
			this.cityPickerValueDefault = [0,0,1]
			this.$refs.simpleAddress.open()
		},
		onConfirm(e) {
			this.address = e.label
		}
	},
	//监听原生导航栏按钮点击事件
	onNavigationBarButtonTap(e) {
		if(e.index === 0){
			uni.navigateBack({
				delta: 1
			})
		}
	},
	//监听搜索框文本变化
	onNavigationBarSearchInputChanged(e) {
		
	},
	//监听软键盘点击搜索事件
	onNavigationBarSearchInputConfirmed(e) {
		
	}
}
</script>

<style>
	page {
		background-color: #F1F1F1;
		height: 100%;
	}
	.city {
		text-align: center;
		font-size: 32rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;
		margin-top: 30rpx;
		border-bottom: 3rpx solid #CCCCCC ;
		padding-bottom: 16rpx;
	}
	.scroll {
		width: 750rpx;
		height: 100%;
		scroll-y: true;
		show-scrollbar: true;
		scroll-into-view: .city
	}
	.box {
		margin-bottom: 180rpx;
	}
	.box1 {
		display: flex;
		flex-direction: column-reverse;
		font-size: 30rpx;
	}
	.box2 {
		display: flex;
		font-size: 30rpx;
		flex-direction: column-reverse;
	}
</style>

